<template>
  <div class="JNPF-common-layout">
    <flow v-if="flowVisible" ref="flow" @close="handleCloseFlow" @choiceFlow="choiceFlow" />
    <FlowBox v-if="formVisible" ref="FlowBox" @close="handleCloseForm" />
  </div>
</template>

<script>
  import flow from '../flowLaunch/Flow';
  import FlowBox from '../components/FlowBox';

  export default {
    name: 'workFlow-addFlow',
    components: { flow, FlowBox },
    data() {
      return {
        flowVisible: false,
        formVisible: false,
        isFromOaJump: false,
      }
    },

    created() {
      this.init()
    },

    methods: {
      init() {
        this.flowVisible = true;
        const { isFromOaJump, id } = this.$route.query;
        this.$nextTick(() => {
          this.$refs.flow.init(true);
          if (isFromOaJump == '1' && id) { // 从OA 新建流程 点进来的 直接打开具体流程
            this.$refs.flow.jump({ id, });
            this.isFromOaJump = true;
          }
        })
      },

      choiceFlow(item) {
        const data = {
          id: '',
          enCode: item.enCode,
          flowId: item.id,
          opType: '-1',
          isFromOaJump: this.isFromOaJump,
        }
        this.formVisible = true
        this.$nextTick(() => {
          this.$refs.FlowBox.init(data)
        })
      },

      handleCloseFlow() {
        this.flowVisible = false;
      },

      handleCloseForm() {
        this.isFromOaJump && window.close();
        this.formVisible = false;
      },
    }
  }
</script>
<style lang="scss" scoped>
  .main {
    height: 100%;
    display: flex;
    flex-direction: column;
    color: #606266;
  }
</style>